
<!--电影列表-->

<template>
  <div class="contain">
    <div class="atom" v-for="(item,index) in filmList">
      <div style="width: 10%">
        <div style="border-radius: 50%;background-color: orange;color: white;width: 30px;height: 30px;text-align: center;align-items: center"><h3>{{index+1}}</h3></div>
      </div>
      <div style="width: 20%">
        <logo style="width: 180px; height: 200px"/>
      </div>
      <div style="width: 70%;justify-content: left">
        <div style="justify-content: space-between;width: 85%">
          <div style="display: flex;justify-content: space-between">
            <h3>{{item.spot_name}}</h3>
            <span>
            <el-button size="small" @click="pushToDetail(item.spot_id)">详 情</el-button>
            <el-button size="small" type="primary" @click="pushToPurchase(item.spot_id)">购 票</el-button>
            </span>
          </div>
          <el-divider></el-divider>
          <p>位置：<span>{{item.spot_addr}}</span></p>
          <p>联系方式：<span>{{item.spot_dial}}</span></p>
        </div>
        <el-divider></el-divider>
      </div>
    </div>
  </div>
</template>

<script>
  import Logo from "@/components/Logo";
  export default {
    name: "FilmList",
    components: {Logo},
    props:{
      filmList:[],
    },
    data(){
      return{
        testList:[
          {
            "id": 1,
            "film_name": "你的名字。",
            "film_length": 106,
            "film_recommend": "影片讲述了一名少年和一名少女在梦中相遇邂逅的奇幻爱情故事。在千年一遇的彗星造访地球的一个月前，身居日本深山小镇的少女宫水三叶（上白石萌音 配音）每天都过着忧郁烦燥的生活，而正处于青春叛逆期的她对大都市的憧憬向往与日俱增。然而不久，三叶做了一个变成男孩子的梦，眼前的这里有着陌生的房间、朋友和她梦寐以求的宽敞街道。三叶虽然感到迷茫困惑，但能够尽情享受朝思暮想的都市生活的她觉得神清气爽。与此同时，远在他乡的东京少年立花泷（神木隆之介 配音）也有一个奇怪的梦境，睁开睡眼的他发现变成一名不知名姓女孩的自己身处一个从",
            "film_box_office": "576248950",
            "film_actor": "新海诚",
            "status": 1,
            "is_on_show": 0,
            "film_type": [
              "爱情",
              "动画",
              "奇幻"
            ]
          },
      {
        "id": 2,
        "film_name": "千与千寻",
        "film_length": 125,
        "film_recommend": "千寻和爸爸妈妈一同驱车前往新家，在郊外的小路上不慎进入了神秘的隧道——他们去到了另外一个诡异世界—一个中世纪的小镇。远处飘来食物的香味，爸爸妈妈大快朵颐，孰料之后变成了猪！这时小镇上渐渐来了许多样子古怪、半透明的人。千寻仓皇逃出，一个叫小白的人救了他，喂了她阻止身体消失的药，并且告诉她怎样去找锅炉爷爷以及汤婆婆，而且必须获得一份工作才能不被魔法变成别的东西。千寻在小白的帮助下幸运地获得了一份在浴池打杂的工作。渐渐她不再被那些怪模怪样的人吓倒，并从小玲那儿知道了小白是凶恶的汤婆婆的弟子。一次，千寻发现小白被",
        "film_box_office": "488807900",
        "film_actor": "宫崎骏",
        "status": 1,
        "is_on_show": 0,
        "film_type": [
        "动画",
        "奇幻",
        "冒险",
        "家庭"
      ]
      },
          {
            "id": 1,
            "film_name": "你的名字。",
            "film_length": 106,
            "film_recommend": "影片讲述了一名少年和一名少女在梦中相遇邂逅的奇幻爱情故事。在千年一遇的彗星造访地球的一个月前，身居日本深山小镇的少女宫水三叶（上白石萌音 配音）每天都过着忧郁烦燥的生活，而正处于青春叛逆期的她对大都市的憧憬向往与日俱增。然而不久，三叶做了一个变成男孩子的梦，眼前的这里有着陌生的房间、朋友和她梦寐以求的宽敞街道。三叶虽然感到迷茫困惑，但能够尽情享受朝思暮想的都市生活的她觉得神清气爽。与此同时，远在他乡的东京少年立花泷（神木隆之介 配音）也有一个奇怪的梦境，睁开睡眼的他发现变成一名不知名姓女孩的自己身处一个从",
            "film_box_office": "576248950",
            "film_actor": "新海诚",
            "status": 1,
            "is_on_show": 0,
            "film_type": [
              "爱情",
              "动画",
              "奇幻"
            ]
          },
    ]
      }
    },
    methods:{
      pushToDetail(param){
        this.$router.push({path:'/viewMovie/MovieDetail',query:{"filmId":param}})
      },
      pushToPurchase(param1){
        this.$router.push({path:'/viewMovie/MovieDetail/Purchase',query:{"filmID":param1}})
      }
    }
  }
</script>

<style scoped>
  .contain{
    display: table;
    width: 100%;
    justify-content: center;
  }
  .atom{
    display: flex;
    margin: 20px;
    height: 200px;
    justify-content: left;
    align-items: center;
  }
</style>
